<template>
  <rx-layout>
    <div slot="center" style>
      <rx-fit>
        <div slot="toolheader" foldheader="true" foldbtn="false" border="false">
            <div class="table-operator">
                <rx-button alias="sysErrorLogDelete" :butn-icon="'delete'" :butn-type="'primary'"
                           :show-no-right="true" @click="delByIds(selectedRowKeys)">
                    {{$ti18('rxList.delBtn','删除')}}
                </rx-button>
                <rx-button :butn-icon="'retweet'"
                           :butn-type="'danger'"
                           :show-no-right="true" @click="deleteAll">{{i18n('list.clearBtn','清空')}}
                </rx-button>
            </div>
          <span class="search-btn-box">
                <span class="search-btn" @click="searchshow"><i class="iconfont iconguolv"></i>{{$ti18('rxList.leachBtn','过滤')}}</span>
           </span>
        </div>
        <div slot="searchbar" btnalign="right"  v-if="fitSearch" @search="search" @cancel="cancel" @close="close">
          <a-form layout="vertical">
                <a-form-item :label="i18n('form.appName','应用名称')">
                    <rx-search-app @change="appChange" v-model="searchApps">
                    </rx-search-app>
                </a-form-item>
                <a-form-item :label="i18n('form.createUserName','转换人')">
                    <a-input :placeholder="i18n('form.createUserName','请输入转换人','input')" v-model="queryParam.Q_CREATE_USER_NAME__S_LK"/>
                </a-form-item>
                <a-form-item :label="i18n('form.tranId','转换ID')">
                    <a-input :placeholder="i18n('form.tranId','请输入转换ID','input')" v-model="queryParam.Q_TRANS_ID__S_LK"/>
                </a-form-item>
                <a-form-item :label="i18n('form.name','转换名称')">
                    <a-input :placeholder="i18n('form.name','请输入转换名称','input')" v-model="queryParam.Q_NAME__S_LK"/>
                </a-form-item>
                <a-form-item :label="i18n('form.status','状态')">
                    <a-select v-model="queryParam.Q_STATUS_S_LK">
                        <a-select-option value="1">{{i18n('list.success','成功')}}</a-select-option>
                        <a-select-option value="0">{{i18n('list.fail','失败')}}</a-select-option>
                    </a-select>
                </a-form-item>

          </a-form>
        </div>
        <rx-grid
                ref="table"
                :allowRowSelect="true"
                :multiSelect="true"
                :columns="columns"
                :defaultPageSize="10"
                url="/api-form/form/core/formTransLog/query"
                :queryParam="queryParam"
                data-field="result.data"
                :pageSizeOptions="['10','30','40']"
                id-field="id"
                @selectChange="onSelectChange"
        >
            <span slot="status" slot-scope="{ text, record }" class="actionIcons">
                  <a-tag :color="statusMap[text].color">
                      <span>{{ statusMap[text].text }}</span>
                  </a-tag>
            </span>
            <span slot="appId" slot-scope="{ text, record }">
                {{ allApps[text] ? $i18(allApps[text].appName, '应用名称') : $ti18('rxList.noAppName', '无') }}
            </span>
            <span slot="action" slot-scope="{ text, record }" class="actionIcons">
                    <span  @click="detail(record)">{{$ti18('rxList.detailBtn','明细')}}</span>
                    <span  @click="delByIds([record.id])">{{$ti18('rxList.delBtn','删除')}}</span>
          </span>
        </rx-grid>
      </rx-fit>
    </div>
  </rx-layout>
</template>

<script>
  import FormTransLogApi from '@/api/form/core/formTransLog'
  import FormTransLogEdit from './FormTransLogEdit'
  import RxSearchApp from "@/views/modules/share/rx-search-app";
  import AppSearch from "@/views/modules/share/AppSearch";
  import {BaseList,RxFit,RxGrid } from "@lowcode/jpaas-common-lib";
  import {mapState} from 'vuex';
  import SysErrorLogApi from "@/api/system/core/sysErrorLog";
  export default {
    name: 'FormTransLogList',
    mixins: [BaseList,AppSearch],
    components: {
      RxFit,
      RxSearchApp
    },
    computed: {
        ...mapState({
            // 所属应用
            allApps: state => state.appSetting ? state.appSetting.allApps : {}
        }),
    },
    data() {
      return {
        columns: [
          {
            title: this.$ti18('rxList.index','序号'),
            type: 'indexColumn',
            width: 100,
            dataIndex: 'serial',
            scopedSlots: {customRender: 'serial'}
          },
          {title: this.i18n('form.appName','应用名称'), dataIndex: 'appId', width: 100,scopedSlots: {customRender: 'appId'}},
          {title: this.i18n('form.createUserName','转换人'), dataIndex: 'createUserName', width: 100},
          {title: this.i18n('form.errorMessage','出错信息'), dataIndex: 'errorMessage', width: 100},
          {title: this.i18n('form.name','转换名称'), dataIndex: 'name', width: 100},
          {title: this.i18n('form.status','状态'), dataIndex: 'status', width: 100 ,scopedSlots: {customRender: 'status'}},
          {title: this.i18n('form.createTime','创建时间'), dataIndex: 'createTime', width: 100},
          {title: this.$ti18('rxList.action','操作'), width: 100, dataIndex: 'action', scopedSlots: {customRender: 'action'}}
        ],
        statusMap: {
            1: { color: 'green', text: this.i18n('list.success','成功') },
            0: { color: 'red', text: this.i18n('list.fail','失败') },
        },
        component:FormTransLogEdit,
        comment: this.i18n('list.comment','转换日志表'),
        widthHeight:['800px','600px'],
        fitSearch:false,
      }
    },
    methods:{
      i18n(name,text,key){
          return this.$ti18(name,text,"formTransLog",key);
      },
      delById(ids){
        return FormTransLogApi.del({ ids: ids.join(',') });
      },
      getListByParams(parameter){
        return FormTransLogApi.query(parameter)
      },
        deleteAll() {
            let self_ = this;
            this.$confirm({
                title: self_.$ti18('rxMsa.actionTips', '操作提示'),
                content:self_.i18n('msa.sureDelete','您确定要清空日志吗？'),
                okText: self_.$ti18("rxForm.okBtn", "确定"),
                cancelText: self_.$ti18("rxForm.cancelBtn", "取消"),
                onOk() {
                    FormTransLogApi.delAll().then(res => {
                        debugger
                        self_.$refs.table.loadData()
                    })
                }
            })
        }

    }
  }
</script>
<style scoped>
  .table-operator {
    padding:4px;
  }
  .table-operator button {
    margin:2px;
  }
</style>

